import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_juwo/common/common_index.dart';

import 'package:flutter_juwo/ui/pages/personalCenterPages/inforPages/initAccount/model/plat_infor_entity.dart';

typedef void ChangeData(Map<String, dynamic> map);
typedef List<Widget> CreateWidgetList();

class CityPicker {
  static void showCityPicker(
    BuildContext context,
    List<PlatInforDataParmsValuelist> valueList, {
    ChangeData selectProvince,
    ChangeData selectCity,
  }) {
    Navigator.push(
      context,
      new _CityPickerRoute(
          data: valueList,
          selectProvince: selectProvince,
          selectCity: selectCity,
          theme: Theme.of(context, shadowThemeOnly: true),
          barrierLabel:
              MaterialLocalizations.of(context).modalBarrierDismissLabel),
    );
  }
}

class _CityPickerRoute<T> extends PopupRoute<T> {
  final ThemeData theme;
  final String barrierLabel;
  final List<PlatInforDataParmsValuelist> data;
  final ChangeData selectProvince;
  final ChangeData selectCity;

  _CityPickerRoute({
    this.theme,
    this.barrierLabel,
    this.data,
    this.selectProvince,
    this.selectCity,
  });

  @override
  Duration get transitionDuration => Duration(milliseconds: 2000);

  @override
  @override
  Color get barrierColor => Colors.black54;

  @override
  bool get barrierDismissible => true;

  AnimationController _animationController;

  @override
  AnimationController createAnimationController() {
    assert(_animationController == null);
    _animationController =
        BottomSheet.createAnimationController(navigator.overlay);
    return _animationController;
  }

  @override
  Widget buildPage(BuildContext context, Animation<double> animation,
      Animation<double> secondaryAnimation) {
    Widget bottomSheet = new MediaQuery.removePadding(
      removeTop: true,
      context: context,
      child: new _CityPickerWidget(
        route: this,
        data: data,
        selectProvince: selectProvince,
        selectCity: selectCity,
      ),
    );
    if (theme != null) {
      bottomSheet = new Theme(data: theme, child: bottomSheet);
    }
    return bottomSheet;
  }
}

class _CityPickerWidget extends StatefulWidget {
  final _CityPickerRoute route;
  final List<PlatInforDataParmsValuelist> data;
  final ChangeData selectProvince;
  final ChangeData selectCity;

  _CityPickerWidget({
    Key key,
    @required this.route,
    this.data,
    this.selectProvince,
    this.selectCity,
  });

  @override
  State createState() {
    return new _CityPickerState();
  }
}

class _CityPickerState extends State<_CityPickerWidget> {
  FixedExtentScrollController provinceController;
  FixedExtentScrollController cityController;
  int provinceIndex = 0, cityIndex = 0;
  List<PlatInforDataParmsValuelist> province = new List();
  List<PlatInforDataParmsValuelistchild> city = new List();

  @override
  void initState() {
    super.initState();
    provinceController = new FixedExtentScrollController();
    cityController = new FixedExtentScrollController();
    setState(() {
      province = widget.data;
      city = widget.data[provinceIndex].children;
    });
  }

  Widget _bottomView() {
    return new Container(
        width: double.infinity,
        color: Colors.white,
        child: new Column(
          children: <Widget>[
            new Expanded(
              child: new Row(
                children: <Widget>[
                  FlatButton(
                    onPressed: () {
                      Navigator.pop(context);
                    },
                    child: new Text(
                      '取消',
                      style: TextStyles.custom(
                          30, Colours.appC3, Font.PingFangMedium),
                    ),
                  ),
                  FlatButton(
                    onPressed: () {
                      Map<String, dynamic> provinceMap = {
                        "code": province[provinceIndex].id,
                        "name": province[provinceIndex].text
                      };
                      Map<String, dynamic> cityMap = {
                        "code": province[provinceIndex].children[cityIndex].id,
                        "name": province[provinceIndex].children[cityIndex].text
                      };
                      if (widget.selectProvince != null) {
                        widget.selectProvince(provinceMap);
                      }
                      if (widget.selectCity != null) {
                        widget.selectCity(cityMap);
                      }
                      Navigator.pop(context);
                    },
                    child: new Text(
                      '确定',
                      style: TextStyles.custom(
                          30, Colours.appC16, Font.PingFangMedium),
                    ),
                  ),
                ],
                mainAxisSize: MainAxisSize.max,
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
              ),
              flex: 1,
            ),
            new Row(
              children: <Widget>[
                new _MyCityPicker(
                  key: Key('province'),
                  controller: provinceController,
                  createWidgetList: () {
                    return province.map((v) {
                      return new Align(
                        child: new Text(
                          v.text,
                          textScaleFactor: 1.2,
                          style: TextStyles.custom(
                              34, Colours.appC1, Font.PingFangMedium),
                        ),
                        alignment: Alignment.center,
                      );
                    }).toList();
                  },
                  changed: (index) {
                    setState(() {
                      provinceIndex = index;
                      cityIndex = 0;
                      cityController.jumpToItem(0);
                      city = widget.data[provinceIndex].children;
                    });
                  },
                ),
                new _MyCityPicker(
                  key: Key('city'),
                  controller: cityController,
                  createWidgetList: () {
                    return city.map((v) {
                      return new Align(
                        child: new Text(
                          v.text,
                          textScaleFactor: 1.2,
                          style: TextStyles.custom(
                              34, Colours.appC1, Font.PingFangMedium),
                        ),
                        alignment: Alignment.center,
                      );
                    }).toList();
                  },
                  changed: (index) {
                    setState(() {
                      cityIndex = index;
                    });
                  },
                ),
              ],
            )
          ],
        ));
  }

  @override
  Widget build(BuildContext context) {
    return new GestureDetector(
      child: new AnimatedBuilder(
        animation: widget.route.animation,
        builder: (BuildContext context, Widget child) {
          return new ClipRect(
            child: new CustomSingleChildLayout(
              delegate: new _BottomPickerLayout(widget.route.animation.value),
              child: new GestureDetector(
                child: new Material(
                  color: Colors.transparent,
                  child: new Container(
                    width: double.infinity,
                    height: 260.0,
                    child: _bottomView(),
                  ),
                ),
              ),
            ),
          );
        },
      ),
    );
  }
}

class _MyCityPicker extends StatefulWidget {
  final CreateWidgetList createWidgetList;
  final Key key;
  final FixedExtentScrollController controller;
  final ValueChanged<int> changed;

  _MyCityPicker(
      {this.createWidgetList, this.key, this.controller, this.changed});

  @override
  State createState() {
    return new _MyCityPickerState();
  }
}

class _MyCityPickerState extends State<_MyCityPicker> {
  List<Widget> children;

  @override
  Widget build(BuildContext context) {
    return new Expanded(
      child: new Container(
        padding: const EdgeInsets.all(6.0),
        alignment: Alignment.center,
        height: 220.0,
        child: CupertinoPicker(
          backgroundColor: Colors.white,
          scrollController: widget.controller,
          key: widget.key,
          itemExtent: 30.0,
          onSelectedItemChanged: (index) {
            if (widget.changed != null) {
              widget.changed(index);
            }
          },
          children: widget.createWidgetList().length > 0
              ? widget.createWidgetList()
              : [new Text('')],
        ),
      ),
      flex: 1,
    );
  }
}

class _BottomPickerLayout extends SingleChildLayoutDelegate {
  _BottomPickerLayout(this.progress, {this.itemCount, this.showTitleActions});

  final double progress;
  final int itemCount;
  final bool showTitleActions;

  @override
  BoxConstraints getConstraintsForChild(BoxConstraints constraints) {
    double maxHeight = 300.0;

    return new BoxConstraints(
      minWidth: constraints.maxWidth,
      maxWidth: constraints.maxWidth,
      minHeight: 0.0,
      maxHeight: maxHeight,
    );
  }

  @override
  Offset getPositionForChild(Size size, Size childSize) {
    double height = size.height - childSize.height * progress;
    return new Offset(0.0, height);
  }

  @override
  bool shouldRelayout(_BottomPickerLayout oldDelegate) {
    return progress != oldDelegate.progress;
  }
}
